<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="gl">

	<head>
		<title>cSans - Rating demo</title>

		<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
		<meta http-equiv="Content-Language" content="gl" />
		<meta name="author" content="A navalla suíza - http://anavallasuiza.com" />

		<link rel="stylesheet" href="../csans/csans.css" type="text/css" />
		<link rel="stylesheet" href="../csans/grid-950-24-10/css/csans-grid-950-24-10.css" type="text/css" />
		<link rel="stylesheet" href="../csans/rating/csans-rating.css" type="text/css" />

		<style type="text/css">
			.custom,
			.custom li a:hover,
			.custom li.current {
				background-image: url(img/rating2.png);
				}
		</style>
	</head>

	<body>
		<div class="page">
			<div class="row t4 b8">
				<h1 class="col11 r1">cSans rating demo</h1>
				<p class="col12 t2 last">
					Convert a ul list in a star rating.<br />
					You can personalize the size, image and length of the rating<br />
				</p>
			</div>
			
			<div class="row">
				<h1>Default style</h1>
				
				<ul class="rating">
					<li class="current" style="width: 70px;"></li>
	
					<li><a href="#" class="one">1</a></li>
					<li><a href="#" class="two">2</a></li>
					<li><a href="#" class="three">3</a></li>
					<li><a href="#" class="four">4</a></li>
					<li><a href="#" class="five">5</a></li>
				</ul>
				
				<h1 class="t5">Custom style</h1>
				
				<ul class="rating custom">
					<li class="current" style="width: 70px;"></li>
	
					<li><a href="#" class="one">1</a></li>
					<li><a href="#" class="two">2</a></li>
					<li><a href="#" class="three">3</a></li>
					<li><a href="#" class="four">4</a></li>
					<li><a href="#" class="five">5</a></li>
				</ul>
			</div>
		</div>
	</body>
</html>